<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="layui-v2.5.7/layui/css/layui.css">
    <link rel="stylesheet" href="css/图书查询.css">
    <script src="layui-v2.5.7/layui/layui.js"></script>
    <script src="jquery/jquery2.0/jquery-2.0.0.js"></script>
    <script src="js/图书查询.js"></script>
    <script src="data/data.js"></script>
</head>
<body>
    <div class="bg">
        <!-- 内容主体区域 -->
        <div class="main">
            <span style="cursor: pointer;">图书管理</span> / <span style="cursor: pointer; color: gray; ">图书查询</span>
            <br><br><br>
            <div class="white">
                <input class="inputSousuo" type="text" placeholder="请输入图书名称">
                <div class="buttonSousuo layui-bg-green" style="display: inline-block;width: 40px;height: 28px;line-height: 26px;text-align: center;"></div>
                <script>
                    $("input:eq(0) + div").html("<i class='layui-icon layui-icon-search' style=' color: white;'></i>")
                </script>
                <br><br>
                <!-- 轮播图 -->
                <div class="layui-carousel" id="test1">
                    <div carousel-item id="lunbo">
                    <!-- <div><img src="imgs/slides/slides01.jpg" style="width: 100%; height: 600px;" alt=""></div>
                    <div><img src="imgs/slides/slides02.jpg" style="width: 100%; height: 600px;" alt=""></div>
                    <div><img src="imgs/slides/slides03.jpg" style="width: 100%; height: 600px;" alt=""></div>
                    <div><img src="imgs/slides/slides04.jpg" style="width: 100%; height: 600px;" alt=""></div>
                    <div><img src="imgs/slides/slides05.jpg" style="width: 100%; height: 600px;" alt=""></div>
                    <div><img src="imgs/slides/slides06.jpg" style="width: 100%; height: 600px;" alt=""></div> -->
                    </div>
                </div>
                <!-- 条目中可以是任意内容，如：<img src=""> -->
                <script>
                layui.use('carousel', function(){
                    var carousel = layui.carousel;
                    //建造实例
                    carousel.render({
                    elem: '#test1'
                    ,width: '100%' //设置容器宽度
                    ,height:'600px'
                    ,arrow: 'always' //始终显示箭头
                    //,anim: 'updown' //切换动画方式
                    });
                });
                </script>
                <div>
                <table class="layui-table">
                    <colgroup>
                        <col width="150">
                        <col width="200">
                        <col>
                    </colgroup>
                        <thead>
                            <tr>
                            <th>名称</th>
                            <th>作者</th>
                            <th>出版社</th>
                            <th>图片</th>
                            </tr> 
                        </thead>
                        <tbody>
                        </tbody>
                </table>
                </div>
            </div>
        </div>
    </div>
    <script>
    layui.use('layer', function(){
    var element = layui.element;
    });
    </script>
</body>
</html>